<template>
  <div>
    <div class="pie-box">
      <query-date
        ref="queryTime"
        :amount="amount"
        :unit="units" :is-show-all="isShowAll"
        :date1="date1"
        @queryTimeData="dataQuery"/>
      <common-total-count ref="totalDom" :obj-data="totalObj"/>
      <div class="include">
        <!-- 列表 -->
        <common-list
          v-if="userTypeIsSixList"
          :data-source="waterListData"
          :is-show-icon="isShowIcon"
          :table-title ="tableTitle"
          @toDetailPage="toDetailPage"
          @toListPage="toListPage"/>
        <!-- 对比 -->
        <pie-map
          v-if="ishowUserTypeSix"
          ref="pieDom"
          :obj="obj1"
          :formatter="formatter"
          :data-source="showDatas"
          :title="pieTitle"/>
        <pie-map
          v-show="isShowPiePrivoceDom"
          ref="piePrivoceDom"
          :obj="obj2"
          :formatter="formatter"
          :data-source="provinceDataShow"
          :title="comparisonPieTitle"/>
        <!-- 排名 -->
        <passenger-bar v-if="isShowPassengerBar" ref="barDom" :obj="passengerBar"/>
        <!-- 状态 -->
        <passenger-bar ref="orderStatusDom" :obj="OrderState"/>
        <!-- <pie-map
          ref="pieOrderStateDom"
          :obj="OrderState"
          :formatter="formatter"
          :data-source="orderStateData"
          :title="pieOrderStateTitle"/> -->
        <pie-map
          ref="pieOrderStateDom"
          :obj="OrderRatio"
          :formatter="formatter"
          :data-source="showDataOrderRatioData"
          :title="pieOrderRatioTitle"/>
        <line-map
          ref="lineDom"
          :dom-obj="weekLine"
          :x-axis-data="days"
          :title="dayTitle"/>
        <pic-bar
          ref="vBarDom"
          :dom-obj="picVBar" />
        <mask-loading
          v-show="isShowMask"
          :msg="msg"
          :num="num"
          :width="width"/>
      </div>
    </div>
    <list-detail :left-val="leftVal" :detail-data="detailData" :title="title" @closeDetail="closeDetail"/>
    <list-page :left-val="leftPageVal" :list-data="listData" :title="listTitle" @closeList="closeList" @toListDetail="toListDetail"/>
  </div>
</template>
<script>
import pieMap from '@/components/pie/pie'
import lineMap from '@/components/line/line'
import picBar from '@/components/bar/verticalBar'
import queryDate from '@/components/queryDate/queryDate'
import common from '@/assets/js/common.js'
import maskLoading from '@/components/mask/mask'
import commonTotalCount from '@/components/CommonTotalCount/CommonTotalCount'
import passengerBar from '@/components/bar/bar'
import CommonList from '@/components/CommonList/CommonList'
import ListDetail from '@/components/ListDetail/ListDetail'
import ListPage from '@/components/List/List'
export default {
  components: {
    pieMap,
    lineMap,
    queryDate,
    picBar,
    maskLoading,
    commonTotalCount,
    passengerBar,
    CommonList,
    ListDetail,
    ListPage
  },
  data () {
    return {
      obj1: 'runningWater',
      weekLine: 'weekLine',
      picVBar: 'picVBar',
      days: [],
      dayTitle: '',
      pieTitle: '',
      comparisonPieTitle: '',
      vBarTitle: '',
      formatter: '',
      showData: [],
      personMoney: '',
      totalMoney: '',
      manageTitle: '',
      areaName: '',
      userType: '',
      date1: '昨日',
      barUnit: '',
      amount: '',
      units: '个',
      isShowAll: false,
      msg: '加载中...',
      num: 1,
      isShowMask: false,
      fieldType: 'count',
      width: '13%',
      passengerBar: 'passengerBar',
      passengerBarTitle: '',
      OrderRatio: 'OrderRatio',
      OrderState: 'OrderState',
      pieOrderStateTitle: '',
      pieOrderRatioTitle: '',
      isShowPiePrivoceDom: true,
      obj2: 'provincePiePassengerDom',
      totalObj: {},
      orderStateData: [],
      showDataOrderRatioData: [],
      showDatas: [],
      provinceDataShow: [],
      ishowUserTypeSix: true,
      tableTitle: {},
      waterListData: [],
      detailData: [],
      isShowIcon: true,
      userTypeIsSixList: true,
      leftVal: '100%',
      leftPageVal: '100%',
      title: '订单详情',
      listTitle: {},
      listData: [],
      isShowPassengerBar: true

    }
  },
  mounted () {
    // 统计信息：navigationColumn
    // 总数：totalCount 、
    // 应收总数：receivableTotalCount、
    // 周期内数量：timeCount、
    // 周期内应收：receivableTimeCount、
    // 上期数量：ringRatioCount、
    // 上期应收：receivableRingRatioCount
    // 列表数据：resultIndexListData
    // 对比数据：resultIndexGroupByRegion
    // 片区数据：resultIndexGroupByArea
    // 趋势数据：resultIndexGroupByTime

    common.isUserType(this, '个')
    this.$nextTick(() => {
      common.homeRequest(1, null, null, this, 'getMemberShip')
    })
    let getRole = JSON.parse(sessionStorage.getItem('getRole'))
    let userType = getRole.userType
    if (userType === 6) {
      this.ishowUserTypeSix = false
    } else if (userType === 7) {
      this.userTypeIsSeven = false
      this.userTypeIsSix = true
      this.isShowSelect = true
      this.ishowUserTypeSix = false
      this.userTypeIsSixList = true
      this.isShowPassengerBar = false
    }
    this.tableTitle = {name: '订单号', value: '金额（元）', title: '昨日' + getRole.areaName + '（往返）乘客安徽'}
    this.listTitle = {title: '昨日 ' + getRole.areaName + '（往返）订单流水', name: '订单号', value: '订单金额 （元）'}
  },
  methods: {
    // 去列表详情
    toListDetail (item) {
      console.log(item)
      common.toDetailRequest(this, item, 'getOrder', 5)
    },
    // 关闭列表
    closeList () {
      this.leftPageVal = '100%'
    },
    // 去列表页
    toListPage () {
      this.leftPageVal = '0%'
      let getHomeData = JSON.parse(sessionStorage.getItem('getHomeData'))
      this.listData = getHomeData.resultData.resultIndexListData
    },
    // 关闭详情
    closeDetail () {
      this.leftVal = '100%'
    },
    // 列表去详情
    toDetailPage (item) {
      common.toDetailRequest(this, item, 'getOrder', 5)
    },
    dataQuery (index) {
      let getMemberShip = JSON.parse(sessionStorage.getItem('getHomeData'))
      common.clickDate(this, index, 'getMemberShip')
      common.dataQueryCommon(index, this, getMemberShip.resultData, this.dayTitle, '个', this.userType, this.pieTitle, this.fieldType, 'getMemberShip')
    },

    firstTimeInit (userType, that, type) {
      let getMemberShip = JSON.parse(sessionStorage.getItem('getHomeData'))
      common.homeShowDate(getMemberShip.resultData, userType, that, type)
    },
    commonInit (dataSource, date, userType, that, num) {
      let getRole = JSON.parse(sessionStorage.getItem('getRole'))
      let changeName = ''
      if (getRole.userType === 1) {
        changeName = '占'
      } else {
        changeName = '对'
      }
      this.pieTitle = date + getRole.areaName + '乘客数' + changeName + '比'
      this.comparisonPieTitle = date + getRole.areaName + '订乘客数占比'
      this.runningWaterData(dataSource, this.pieTitle, date)
      this.commonData('昨日')
      if (num === 0) {
        this.vBarTitle = '近7天' + getRole.areaName + '乘客量'
        common.isNull(dataSource, that, '近7天' + getRole.areaName + '乘客数趋势', '个', userType, this.pieTitle)
      } else {
        this.commonData(date)
        common.isNull(dataSource, that, date + getRole.areaName + '乘客数趋势', '个', userType, this.pieTitle)
        this.vBarTitle = date + getRole.areaName + '乘客量'
      }
    },
    // 饼图专用函数
    runningWaterData (data, title, date) {
    // userType为1代表是最高全限看全国
      let showDatas = []
      let getRole = JSON.parse(sessionStorage.getItem('getRole'))
      let dataSource = data.resultIndexGroupByRegion
      showDatas = common.hotPicPieData(dataSource, this, 'name', 'value')
      // this.amount = dataSource[0].Regioncount
      let orderStateData = data.resultMemberShipOrderStatus
      let showDataOrderRatioData = data.resultMemberShipOrderSource
      this.pieOrderStateTitle = date + getRole.areaName + '乘客乘坐状态'
      this.pieOrderRatioTitle = date + getRole.areaName + '乘客下单来源占比'
      // 省区经理饼图对比
      let provinceData = data.resultIndexGroupByArea
      let provinceDataShow = []
      if (provinceData.length > 0) {
        provinceDataShow = common.hotPicPieData(provinceData, this, 'name', 'value')
        this.isShowPiePrivoceDom = true
      } else {
        this.isShowPiePrivoceDom = false
      }
      this.orderStateData = orderStateData
      this.showDataOrderRatioData = showDataOrderRatioData
      this.showDatas = showDatas
      this.provinceDataShow = provinceDataShow
      // 乘客下单状态
      let yData = []
      for (let i in orderStateData) {
        yData.push(orderStateData[i].name)
      }
      let payDealData = ''
      payDealData = common.maxValue(orderStateData, this, 'value', '个')
      this.$refs.orderStatusDom.barData(yData, payDealData.yaisData, this.pieOrderStateTitle, payDealData.unit)
    },
    commonData (date) {
      let getRole = JSON.parse(sessionStorage.getItem('getRole'))
      let getHomeData = JSON.parse(sessionStorage.getItem('getHomeData'))
      let totalCountData = getHomeData.resultData.navigationColumn
      this.allAmount = totalCountData.totalCount
      this.amount = totalCountData.timeCount
      this.priorPeriod = totalCountData.ringRatioCount
      this.rightTitle = date + getRole.areaName + '乘客数'
      this.leftTitle = getRole.areaName + '总乘客数'
      this.pieOrderStateTitle = date + getRole.areaName + '乘客下单状态'
      this.pieOrderRatioTitle = date + getRole.areaName + '乘客下单来源占比'
      this.tableTitle = {name: '订单号', value: '金额（元）', title: date + getRole.areaName + '（往返）注册司机'}
      this.listTitle = {title: date + getRole.areaName + '（往返）订单流水', name: '订单号', value: '订单金额 （元）'}
      this.totalObj = {
        leftTitle: this.leftTitle,
        rightTitle: this.rightTitle,
        allAmount: this.allAmount,
        amount: this.amount,
        unit: '个',
        priorPeriod: this.priorPeriod
      }
      // 乘客下单状态
      // this.$refs.totalDom.changeTitle(totalObj)
      // 前6名排名
      this.passengerBarTitle = date + getRole.areaName + '乘客数前列排名'
      let resultMembershipProvinceData = getHomeData.resultData.resultIndexListData
      let yData = []
      let payDealData = ''
      payDealData = common.maxValue(resultMembershipProvinceData, this, 'value', '个')
      if (resultMembershipProvinceData && resultMembershipProvinceData.length > 0) {
        for (let k = 0; k < 6 && k < resultMembershipProvinceData.length; k++) {
          if (resultMembershipProvinceData[k].provinceName === 'undefined') {
            break
          } else {
            yData.push(resultMembershipProvinceData[k].name)
          }
        }
      }
      let barXData = payDealData.yaisData.splice(0, 6)
      if (this.$refs.barDom) {
        this.$refs.barDom.barData(yData.reverse(), barXData.reverse(), this.passengerBarTitle, payDealData.unit)
      }

      // 乘客列表
      this.waterListData = resultMembershipProvinceData
    }
  }
}

</script>
